<template>
	<view class="container">
		<view class="header">
			<view class="header-item gui-color-black">单号： {{ form.code }}</view>
			<!-- <view class="header-item gui-color-black" style="margin-top: 15rpx;">盘点人 123457899</view> -->
			<view class="gui-margin-top">
				<textarea name="remark" :value="form.remark||'暂无备注'" disabled placeholder=""
					class="gui-textarea gui-bg-gray gui-border-box" style="width:690rpx;color:#999" />
			</view>
		</view>
		<view style="text-align: center;margin-top: 60rpx;" v-if="list.length == 0">暂无数据~</view>
		<view class="list" v-if="list.length>0">
			<view class="item" v-for="(item,index) in list" :key="index">
				<view class="gui-flex">
					<view class="goods-box gui-flex">
						<view class="image">
							<gui-image :src="item.change_thumb" :width="150"></gui-image>
						</view>
						<view class="goods-content">
							<view class="title">{{ item.title }}</view>
							<view class="gui-color-gray">规格：{{ item.sku }}</view>
							<view class="gui-color-gray">条码：{{ item.product_sn }}</view>
							<view class="gui-color-gray">库存：{{ item.stock }}</view>
						</view>
					</view>
				</view>
				<view class="bottom gui-border-t ">
					<view class="gui-flex gui-space-between bottom-item">
						<view class="gui-color-gray">盘点数量</view>
						<view class="gui-text-b">
							{{ item.params }}
						</view>
					</view>
					<view class="gui-flex gui-space-between bottom-item">
						<view class="gui-color-gray">盘盈盘亏数量</view>
						<view class="gui-text-b">
							<text v-if="item.stock_change>0">+{{item.stock_change}}</text>
							<text v-if="item.stock_change<=0">{{item.stock_change}}</text>
						</view>
					</view>
					<view class="gui-flex gui-space-between bottom-item">
						<view class="gui-color-gray">盘盈盘亏成本</view>
						<view class="gui-text-b">
							<view v-if="item.option_id">
								<text v-if="item.stock_change>0">+{{item.option_cost_price*item.stock_change}}</text>
								<text v-if="item.stock_change<=0">{{item.option_cost_price*item.stock_change}}</text>
							</view>

							<view v-else>
								<text v-if="item.stock_change>0">+{{item.cost_price*item.stock_change}}</text>
								<text v-if="item.stock_change<=0">{{item.cost_price*item.stock_change}}</text>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [],
				goods_ids: [],
				form: {
					code: '',
					remark: ''
				}

			}
		},
		onPullDownRefresh() {
			this.getDetail()
		},
		onLoad(options) {
			this.id = options.id;
			this.form.code = options.code;
			this.form.remark = options.remark
			this.getDetail();

		},
		methods: {
			async getDetail() {
				let res = await this.$http.post(
					`/admin/shop?route=plugin.store-cashier.store.admin.goods-stock.batchDetail&id=${this.id}`)
				this.list = res.data.data.stock_batch.selected_list;
				uni.stopPullDownRefresh()
				//this.getList();
			},
			async getList() {
				let res = await this.$http.post(
					`/admin/shop?route=plugin.store-cashier.store.admin.goods.goods-option-search`, {
						"keyword": "",
						"except_supplier": 1,
						"goods_ids": this.goods_ids
					})
				this.list = res.data.data;
				uni.stopPullDownRefresh()
			}
		}
	}
</script>

<style scoped lang="scss">
	.list {
		.item {
			background-color: #fff;
			margin-bottom: 20rpx;
			padding: 30rpx;
			font-size: 28rpx;

			.bottom {
				padding-top: 20rpx;
				margin-top: 20rpx;
				.bottom-item{
					line-height: 1;
					margin-bottom: 20rpx;
				}
				.bottom-item:last-child{
					margin-bottom: 0;
				}
			}

			.goods-box {

				.title {
					font-weight: bold;
					margin-bottom: 10rpx;
				}

				.goods-content {
					margin-left: 20rpx;
				}
			}

			.radio-box {}
		}
	}

	.header {
		background-color: #fff;
		padding: 30rpx;
		box-shadow: 0 0 5px #eee;
	}
</style>